<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <!--
        当前测试：自动构建表格行列数
    -->
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project - testall</title>
        <link href="css/MyTable_style.css" rel="stylesheet" />
        <link href="script/Kontext/css/kontext.css" rel="stylesheet" />
        <style>
			.wrap {
				-webkit-perspective: 1000px;
				-moz-perspective: 1000px;
				perspective: 1000px;
				-webkit-transform-style: preserve-3d;
				-moz-transform-style: preserve-3d;
				transform-style: preserve-3d;
			}
			.wrap .move {
				width: 300px;
				height: 200px;
				background-color: #69d;
				
			}
			.wrap .move:hover {
				/*
				width: 500px;
				transition: width 1s linear;
				height: 300px;*/
				-webkit-animation: hide-left 1s forwards ease;
			}
			
        </style>
        <script src="script/jquery-1.9.1.js" type="text/javascript"></script>  
        <script>
            $(function(){
                //alert($("#divbtn").html());
                $("#divbtn").click(function(){
                    $("#only").children().append(f_newtrstr(2,2));
                    alert( $("#only").html());
                    });
                    
                $("#ajaxBtn").click(function(){
                    $("#showajaxload").load("newfile.txt #p1");
                    /*
                    $("#showajaxload2").load("new_file.php h1",{"key":"value","name":"jurnlee"},function(ResponeTxt,status,xhr){
                                            if(status=="success")alert("ok!"+xhr.status); //=200
                                            if(status=="error")alert("error:"+xhr.status);
                                        });*/
                    
                    $("#showajax").html(
                        $.ajax({
                            url:"new_file.php",
                            type: 'post',
                            data:{key:"value",name:"jurnlee"},
                            success:function(data){alert( "newnewnew");$("#showajax").html(data);}
                        }));
                });
            });
            function f_newtrstr(trnum,tdnum) {
                var $trinit =  $("<tr class='autonewtr'></tr>");
                var $tdinit = $("<td></td>");
                var $trstr=$trstrsum = $(""),$tdstr=$("");
                for(var ii = 0;ii<trnum;ii++){
                    if($trstr=$("")) {$trstr = $trinit  ; alert("ii="+ii+$("#temp").append($trstr).html() );}
                    else  {$trstr=$trstr.children().last().after($trinit);
                        alert("ii="+ii+$("#temp").append($trstr).html() );
                        }
                    //alert("out:ii="+ii+$trstr.html());        //attr("TagName")
                    for(var jj=0;jj<tdnum;jj++){
                        //if($tdstr=$("")) $tdstr = $tdinit  ;
                        //else  $tdstr.after($tdinit);
                        $trstrsum=$trstr.append($tdinit);
                        alert("in:jj="+jj+$("#temp1").append($trstr).html());
                    } };
                return $trstrsum;
            }
        </script>   
    </head>
    <body>
        
        <table width="80%" id="tb_sty2">
        <tr>
            <td>公式名称</td>
            <td>公式名称</td>
            <td>公式名称</td>
        </tr>
        <tr >
            <td>公式名称</td>
            <td>公式名称</td>
            <td>公式名称</td>
        </tr>
        
    </table>
    <br />
    <div id="divbtn"><h2>maybe click here</h2></div>
    <br />
    <div id="only" style="width: 80%;margin: 0px auto;">
        <table> 
        </table>
    </div>
    <div id="temp"> </div>

        <div id="temp1"> </div>
        <p>11 </p>
        <p class="cc">22 </p>
        <p  class="cc"> 33</p>
        <p> 44</p>
        
            <div class="wrap"> 
            <div class="move"> </div>
            </div>
            <br />
        <button value="button" id="ajaxBtn" >
            button
        </button>
        <div id="showajaxload"> </div>
        <div id="showajaxload2"> </div>
        <div id="showajaxget"> </div>
        <div id="showajaxpost"> </div>
        <div id="showajax"> </div>
    </body>
</html>
